(function(Vue){
    Vue.component("home",{
        template:`<h1>主页组件</h1>`
    });
    Vue.component("company",{
        template:`<h1>公司介绍组件</h1>`
    });
    Vue.component("product",{
        template:`<h1>产品详情组件</h1>`
    });
    let routes = [
        {
            path:"/home",
            component:"home"
        },
        {
            path:"/company",
            component:"company"
        },
        {
            path:"/product",
            component:"product"
        }
    ];
    //添加hashchange 监听事件
    window.addEventListener("hashchange",function(e){
        // console.log(window.location.hash);
        let path = window.location.hash.split('#')[1];  // /home
        // console.log(path);
        let route_item = routes.find(v =>{
            if(v.path === path){
                return true;
            }
        })
        // console.log(route_item);
        // console.log(vm.componentId);
        vm.componentId = route_item.component;
    });
})(Vue);